<template>
  <view class="wrap">
    <uv-tabs :list="tabsList" :current='current' :scrollable='false' inactiveStyle='font-weight: 500; font-size: 30rpx; color: #737373;transition: all .3s;' activeStyle='font-weight: 500; font-size: 36rpx; color: #2B2B2B;transition: all .3s;' itemStyle='height: 88rpx;padding: 0;' lineColor='#E43222' lineWidth='36rpx' lineHeight='6rpx' @click="tapClick"></uv-tabs>
    <uv-line color="#979797"></uv-line>
    
    <view class="list">
      <template v-if="current == 0">
        <theme :detail='item' v-for="(item, index) in list" :key="index" :order='false' @followClick='followClick' @tagMore='tagMore(item)'></theme>
      </template>
      <template v-else>
        <news :detail='item' v-for="(item, index) in list" :key="index" @followClick='followClick'></news>
      </template>
    </view>
    
  </view>
</template>

<script setup>
import theme from '../../components/group/theme.vue';
import news from '../../components/dynamic/news.vue';
import { onLoad, onReachBottom } from '@dcloudio/uni-app';
import { post } from '@/api';
import { ref } from 'vue';

const tabsList = [
  {name: '主题'},
  {name: '动态'}
];
let current = ref(0);
let list = ref([]);
let last_page = 0;
let page = 1;
let limit = 15;
let showLeng = ref(false);

onLoad(() => {
  getList();
})
// 上拉加载
onReachBottom(async () => {
  if(last_page < page || last_page == page) return;
  page++
  getList();
})

function getList(){
  const params = {
    page,
    limit,
    type: Number(current.value) + 1
  }
  post('api/user_views_log/getUserViewsLogList', params).then(res => {
    if(res.code == 1){
      const data = res.data;
      last_page = data.last_page;
      let arr = data.data.map(e => {
        if(params.type == 1){
          return e.theme_info
        }else{
          return e.news_info
        }
      })
      list.value = [...list.value, ...arr];
      if(list.value.length){
        showLeng.value = false;
      }else{
        showLeng.value = true;
      }
    }
  })
}
function followClick(row){
  list.value.forEach(e => {
    if(row.userId == e.user.id){
      e[row.type] = e[row.type] == 1 ? 0 : 1;
    }
  })
}
function tapClick({ index }){
  current.value = index;
  page = 1;
  list.value = [];
  getList();
}
</script>

<style lang="scss" scoped>
  .list{
    padding: 0 30rpx;
  }
</style>